
<template>
    <div class="ChangeTable">
        <Row>
            <Col span="24">
                <Table
                    ref="table"
                    :columns="isSP ? contractTableHeadPartner : contractTableHead"
                    :data="contractTable.records"
                    :loading="loading"
                    border
                >
                    <template slot-scope="{ row, index }" slot="action">
                        <!--
                            处理  isViewBtn ~~审核中 待补件 待补件审核~~
                            编辑 草稿
                            删除 草稿
                        -->
                        <Button :disabled="!row.isViewBtn" type="primary" size="small" @click="showContractDetial(row)">处理</Button>
                        <Button :disabled="row.processStatus !== 'draft'" type="primary" size="small" @click="showContractDetial(row)">编辑</Button>
                        <Button :disabled="row.processStatus !== 'draft'" type="error" size="small" @click="del(row)">删除</Button>
                    </template>
                    <template slot-scope="{ row, index }" slot="applyNo">
                        <a class="applyNo" @click="showContractDetial(row,true)">{{row.applyNo}}</a>
                    </template>
                    <template slot-scope="{ row, index }" slot="contractNo">
                        <a class="contractNo" @click="showContractDetial(row,true)">{{row.contractNo}}</a>
                    </template>
                    <template slot-scope="{ row, index }" slot="businessSource">
                        <span>{{getTitle('businessSource',businessSource)}}</span>
                    </template>
                    <template slot-scope="{ row, index }" slot="dataSource">
                        <span>{{getTitle('dataSource',row.dataSource)}}</span>
                    </template>
                    <template slot-scope="{ row, index }" slot="processStatus">
                        <span>{{getTitle('processStatus',row.processStatus)}}</span>
                    </template>
                    <template slot-scope="{ row, index }" slot="changeSubject">
                        <span>{{getTitle('ContactChangeType',row.changeType)}}</span>
                    </template>
                </Table>
            </Col>
            <Col span="24">
                <Row type="flex" justify="end" class="table-page">
                    <Page
                        :current="contractTable.current"
                        :transfer="true"
                        :total="contractTable.total"
                        :page-size="contractTable.size"
                        @on-change="changePage"
                        @on-page-size-change="changePageSize"
                        :page-size-opts="pageSizeOpts"
                        size="small"
                        show-total
                        show-elevator
                        show-sizer
                    ></Page>
                </Row>
            </Col>
        </Row>
    </div>
</template>
<script>
    import {delInfo, getManageContactChangeList} from "_p/basic/api/contract/post-loan-info-change"
    import {getTitleFromDataDict} from "_p/basic/assets/contract/js/utils";

    export default {
    props: {
        formValidate: {
            type: Object,
            required: true
        },
        dataDict: {
            type: Object,
            required: true
        },
        contractTable: {
            type: Object
        },
        businessSource: {
            type: String,
            required: true
        },
        loading: {
            type: Boolean,
            required: true,
            default: true
        },
        isSP: {
            type: Boolean,
            required: true
        }
    },
    data() {
        return {
            // loading: false,
            pageSizeOpts: [10, 20, 50, 100],
            contractTableHead: [
                {
                    title: "操作",
                    slot: "action",
                    width: 180,
                    align: "center"
                },
                {
                    title: "合同号",
                    key: "contractNo",
                    ellipsis: true,
                    tooltip: true,
                    minWidth: 150,
                    render: (h, params) => {
                        return h('Tooltip', {
                            props: {
                                content: params.row.contractNo,
                                transfer: true
                            }
                        }, [h('a', {
                            class: 'contractNo',
                            style: {
                                width: (params.column._width - 38) + 'px',
                            },
                            on: {
                                click: () => {
                                    this.showContractDetial(params.row, true)
                                }
                            }
                        }, params.row.contractNo)])
                    }
                },
                {
                    title: "申请编号",
                    key: "applyNo",
                    // slot: "applyNo",
                    minWidth: 150,
                    // render: (h, params) => {
                    //     return h('Tooltip', {
                    //         props: {
                    //             content: params.row.applyNo,
                    //             transfer: true
                    //         }
                    //     }, [h('a', {
                    //         class: 'applyNo',
                    //         style: {
                    //             width: (params.column._width - 38) + 'px',
                    //         },
                    //         on: {
                    //             click: () => {
                    //                 this.showContractDetial(params.row, true)
                    //             }
                    //         }
                    //     }, params.row.applyNo)])
                    // }
                },

                {
                    title: "客户姓名",
                    key: "custName",
                    ellipsis: true,
                    tooltip: true,
                    minWidth: 100,
                },
                {
                    title: "证件号码",
                    key: "certNo",
                    ellipsis: true,
                    tooltip: true,
                    minWidth: 160,
                },
                {
                    title: "处理状态",
                    key: "processStatus",
                    minWidth: 100,
                    ellipsis: true,
                    tooltip: true,
                    slot: "processStatus"
                },
                {
                    title: "变更类型",
                    key: "changeSubject",
                    minWidth: 150,
                    ellipsis: true,
                    tooltip: true,
                    slot: "changeSubject"
                },
                {
                    title: "来源",
                    key: "dataSource",
                    minWidth: 110,
                    ellipsis: true,
                    tooltip: true,
                    slot: "dataSource"
                },
                {
                    title: "业务来源",
                    key: "businessSource",
                    minWidth: 150,
                    ellipsis: true,
                    tooltip: true,
                    slot: "businessSource"
                },
                {
                    title: "申请时间",
                    key: "applyDate",
                    ellipsis: true,
                    tooltip: true,
                    minWidth: 150,
                },
                {
                    title: "结束时间",
                    key: "endDate",
                    minWidth: 150,
                    ellipsis: true,
                    tooltip: true,
                }
            ],
            contractTableHeadPartner: [
                {
                    title: "操作",
                    slot: "action",
                    width: 180,
                    align: "center"
                },
                {
                    title: "申请编号",
                    key: "applyNo",
                    // slot: "applyNo",
                    minWidth: 150,
                    render: (h, params) => {
                        return h('Tooltip', {
                            props: {
                                content: params.row.applyNo,
                                transfer: true
                            }
                        }, [h('a', {
                            class: 'applyNo',
                            style: {
                                width: (params.column._width - 38) + 'px',
                            },
                            on: {
                                click: () => {
                                    this.showContractDetial(params.row, true)
                                }
                            }
                        }, params.row.applyNo)])
                    }
                },
                {
                    title: "客户姓名",
                    key: "custName",
                    ellipsis: true,
                    tooltip: true,
                    minWidth: 100,
                },
                {
                    title: "证件号码",
                    key: "certNo",
                    ellipsis: true,
                    tooltip: true,
                    minWidth: 160,
                },
                {
                    title: "处理状态",
                    key: "processStatus",
                    minWidth: 100,
                    ellipsis: true,
                    tooltip: true,
                    slot: "processStatus"
                },
                {
                    title: "变更类型",
                    key: "changeSubject",
                    minWidth: 150,
                    ellipsis: true,
                    tooltip: true,
                    slot: "changeSubject"
                },
                {
                    title: "申请时间",
                    key: "applyDate",
                    ellipsis: true,
                    tooltip: true,
                    minWidth: 150,
                },
                {
                    title: "结束时间",
                    key: "endDate",
                    minWidth: 150,
                    ellipsis: true,
                    tooltip: true,
                }
            ]
        };
    },
    mounted() { },
    methods: {
        init() { },
        // 分页 Fn
        changePageSize(num) {
            this.$emit(
                "getList",
                Object.assign({}, this.formValidate, { pageSize: num })
            );
            this.formValidate.pageSize = num;
        },
        changePage(num) {
            this.$emit(
                "getList",
                Object.assign({}, this.formValidate, { pageNumber: num })
            );
            this.formValidate.pageNumber = num;
        },
        // 删除
        del(row) {
            if (!row.contractNo) return;
            this.$Modal.confirm({
                title: "确认删除？",
                onOk: () => {
                    this.deleteQuery(row.id);
                }
            });
        },
        deleteQuery(id) {
            delInfo(id,this.isSP).then(res => {
                this.loading = false;
                if (res.code === "0000") {
                    // this.contractTable = res.data;
                    this.$Message.success(res.data);
                    this.$emit("getList", this.formValidate);
                }
            });
        },
        showContractDetial(row, isReadOnly = null) {
            this.$emit("showContractDetial", row, isReadOnly);
        },
        getTitle(type, val) {
            let data = this.dataDict[type + "Dict"] || [];
            return getTitleFromDataDict(data, val);
        },
        //导出报表
        exportData () {
            this.dataForExport = [];
            let clo = {};
            if(this.isSP){
                clo = this.contractTableHeadPartner;
            }else{
                clo = this.contractTableHead;
            }
            getManageContactChangeList(this.formValidate,this.isSP).then(res => {
                if (res.code === "0000") {
                    this.dataForExport = res.data.records;
                    this.dataForExport.forEach(line =>{
                        line.processStatus = this.getTitle("processStatus",line.processStatus);
                        line.changeSubject = this.getTitle("changeSubject",line.changeSubject);
                        line.dataSource = this.getTitle("dataSource",line.dataSource);
                        line.businessSource = this.getTitle("businessSource",line.businessSource);
                        line.certNo =  line.certNo ? "\t" + line.certNo : null;
                    });

                    this.$refs.table.exportCsv({
                        filename: '联系方式变更任务列表',
                        columns: clo.filter((col, index) => index > 0),
                        data: this.dataForExport
                    });
                } else {
                    this.$Message.error("导出失败");
                }
            });
        },
    }
};
</script>
<style scoped>
</style>
